import React, { render, Component } from './react'

const root = document.getElementById("root")

const jsx = (
    <div>
        <p>Hello</p>
        <p>React</p>
        <p>Vue</p>
    </div>
)

// render(jsx, root)

// setTimeout(() => {
//     const jsx = (
//         <div>
//             <p>React</p>
//             <p>Vue</p>
//         </div>
//     )
//     render(jsx, root)
// }, 1000);
class Greating extends Component {
    constructor (props) {
        super(props)
        this.state = {
            name: '张三'
        }
    }
    render () {
        return (<div>
            { this.props.title }
            <br />
            { this.state.name }
            <br />
            <button onClick={ () => this.setState({name: '李四'}) }>button</button>
        </div>)
    }
}

// function FnComponent(props) {
//     return <div>{props.title}</div>
// }

render(<Greating title="xxxx" />, root)